import React, { LegacyRef, useRef, useState } from 'react';
import { HotTable } from '@handsontable/react';
import 'handsontable/languages/zh-CN';

let data = [
  ['age', 'gender', 'zipcode'],
  ['*', 'male', '81***'],
  ['*', 'female', '81***'],
  ['*', 'male', '81***'],
  ['*', 'female', '81***'],
  ['*', 'female', '81***'],
  ['*', 'male', '81***'],
  ['*', 'male', '81***'],
];

export default function Explore() {
  const [language, setLanguage] = useState('zh-CN');

  const hottable = useRef<HotTable>();
  return (
    <div>
      <h1>匿名化结果</h1>
      <HotTable
        ref={hottable as LegacyRef<HotTable>}
        language={language}
        data={data}
        licenseKey="non-commercial-and-evaluation"
        contextMenu={true}
      />
    </div>
  );
}